<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>确认下单</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css">
    <link rel="stylesheet" type="text/css" href="../css/aui-flex.css" />
    <link rel="stylesheet" type="text/css" href="../css/buy.css">

    <script type="text/javascript" src="../js/base.js"></script>
    <style>
        .goodsList{
            height:2.25rem;line-height: 2.25rem
        }
        @media screen and (max-width:320px){
            .goodsType{  width:4.5rem;overflow: hidden;white-space:nowrap;text-overflow: ellipsis; }
        }
    </style>
</head>
<body>
<!--<header class="aui-bar aui-bar-nav aui-bar-top">-->
    <!--<a class="aui-pull-left aui-btn goBack" >-->
        <!--<span class="aui-iconfont aui-icon-left"></span>-->
    <!--</a>-->
    <!--<div class="aui-title">确认下单</div>-->
<!--</header>-->
<section id="app" v-cloak>
    <div  v-if="navigator && navigator.onLine === true">
        <div v-if="defaultAddress.consignee" class="address"  v-cloak >
            <form class="form"  v-on:click="goAddRegion()">
                <div >
                    <div class="aui-padded-b-10 aui-padded-t-10" style="width:95%;border-bottom: 1px solid #efefef">
                        <span style="margin-right: 0.3rem">收货地址:</span>
                        <span style="margin-right: 0.5rem">{{defaultAddress.consignee}}</span>
                        <span>{{defaultAddress.tel}} </span>
                    </div>
                    <div class="aui-padded-t-10 aui-font-size-15 textCol" style="width:94%">{{defaultAddress.province_name}} {{ defaultAddress.city_name}} {{ defaultAddress.district_name}}&nbsp;&nbsp;{{ defaultAddress.address}}</div>
                    <div class="aui-padded-b-5 aui-padded-t-5" style="width:95%"></div>
                    <span class="aui-iconfont aui-icon-right rightIco"></span>
                </div>
            </form>
        </div>

        <div v-if="!defaultAddress.consignee" class="noAddress">
            <ul class="aui-list aui-list-in" v-on:click="goAddRegion()">
                <li class="aui-list-item">
                    <div class="aui-list-item-inner aui-list-item-arrow">
                        <div class="aui-list-item-title">请填写地址</div>
                        <div class="aui-list-item-right">
                        </div>
                    </div>
                </li>
            </ul>
        </div>

        <div class="aui-flex-row aui-margin-b-5"   v-if="shopCartArr.length>0 & !goodsInfo.goods_image" ><!--购物车购买-->
            <ul>
                <li class="aui-flex-col aui-flex-item-12 aui-padded-b-10"  v-for="goods in shopCartArr" v-if="goods.is_checkT" style="margin-bottom:0.3rem;background: #fff">
                    <div class="aui-flex-item-4 aui-padded-l-10"  style="height:4.5rem">
                        <img v-bind:src="getImage(goods.goods_image)">
                    </div>
                    <div class="aui-flex-item-6 ">
                        <div class=" aui-margin-b-10 " style="margin-top: 0.7rem">
                            <div class=" aui-padded-l-10 aui-font-size-16 goodsType">{{goods.goods_name}} </div>
                            <div class="aui-font-size-12  textCol" style="width:7.5rem;overflow: hidden;white-space:nowrap;text-overflow: ellipsis;">{{goods.goods_desc}}</div>
                            <div class=" aui-font-size-12 textCol" >
                                <div v-if="!goods.attrValueGoods[0]"></div>
                                <div v-else class=" aui-padded-l-10">型号:{{goods.attrValueGoods[0]}}</div>
                                <div v-if="!goods.attrValueGoods[1]"></div>
                                <div v-else class=" aui-padded-l-10"> 颜色:{{goods.attrValueGoods[1]}}</div>
                                <!--<div class=" aui-padded-l-10 aui-padded-t-5"><img src="../icon/2-1/fenxiang.png" style="height:0.5rem"></div>-->

                            </div>
                        </div>
                    </div>
                    <div class="aui-flex-item-2 aui-text-right aui-padded-r-10" style="margin-top:0.7rem">
                        <div> ￥<span>{{goods.shop_price*goods.goods_number}}</span></div>
                        <div class="textCol" style="text-decoration:line-through;" > ￥<span>{{goods.market_price*goods.goods_number}}</span></div>

                        <div class="aui-font-size-12 textCol" style="position:relative;top:0.6rem">
                            x <span>{{goods.goods_number}}</span>
                        </div>
                    </div>
                    <!--<div class=" aui-content textCol" style="width:100%;margin-top:0.5rem">-->
                        <!--<div class=" aui-pull-left aui-padded-l-10">商品金额</div>-->
                        <!--<div class=" aui-pull-right aui-padded-r-10" > ￥<span>{{goods.shop_price*goods.goods_number}}</span></div>-->
                    <!--</div>-->
                </li>
            </ul>
            <div class="aui-padded-l-10 aui-padded-r-10 " style="background: #fff;width:100%">
                <!--<div class="goodsList" >-->
                    <!--<div class="aui-pull-left  ">推荐人</div>-->
                    <!--<div class="aui-pull-right textColor">小普</div>-->
                <!--</div>-->
                <div v-if="TJuserINfo.referename" class=" aui-padded-t-10   aui-padded-b-10 ">
                    <div class="aui-pull-left">推荐人</div>
                    <div class="aui-pull-right aui-padded-r-10 textColor">{{TJuserINfo.referename}}</div>
                </div>
                <div style="clear: both"></div>
                <div style="width:98%;border-bottom: 1px solid #efefef;margin:0 1%"></div>
                <div class="goodsList">
                    <div class="aui-pull-left">商品总金额</div>
                    <div class="aui-pull-right  textColor">￥{{countPrice}}</div>
                </div>
                <div style="clear: both"></div>
                <div style="width:98%;border-bottom: 1px solid #efefef;margin:0 1%"></div>
                <div class=" goodsList"  style="background: #fff">
                    <div class="aui-pull-left "> 运费</div>
                    <div class="aui-pull-right  textColor"> ￥<span>0.00</span> </div>
                </div>
            </div>


            <div class="aui-margin-t-10 aui-margin-b-10" style="width:100%;">
                <div class="aui-padded-l-10 goodsList"   @click="goFaPiao()"  style="background: #fff;width:100%;">
                    <div class="aui-pull-left ">  发票</div>
                    <div class="aui-pull-right aui-padded-r-10">
                        <span v-if="faPiaoInfo.isHave == '0'">不开发票</span>
                        <span v-if="faPiaoInfo.type == '0'">{{faPiaoInfo.tel}}</span>
                        <span v-if="faPiaoInfo.type == '1'">{{faPiaoInfo.companyName}}</span>
                        <i class="aui-iconfont aui-icon-right aui-padded-r-5"></i>
                    </div>
                </div>
                <div style="clear: both"></div>
                <div class="aui-padded-l-10 aui-margin-t-10 goodsList"   @click="goCoupon()"  style="background: #fff;width:100%;">
                    <div class="aui-pull-left">    优惠券</div>
                    <div class="aui-pull-right aui-padded-r-10">
                        <span  v-if="couponPrice.is_used != 0 && couponPrice.is_used != 1">使用优惠券</span>
                        <span class="textColor" v-if="couponPrice.is_used==0">-￥{{couponPrice.coupon_mustmoney}}</span>
                        <span  v-if="couponPrice.is_used==1">无可用</span>
                        <i class="aui-iconfont aui-icon-right aui-padded-r-5"></i>
                    </div>
                </div>
            </div>
            <div class=" aui-padded-t-5 message">
                <span>选填:</span>
                <textarea type="text" rows="5" cols="50" placeholder="给商家留言(45字以内)" v-model="submitInfo.massage"></textarea>
            </div>


            <footer class="aui-bar aui-bar-tab "   style="width:100%;border-top:1px solid #ddd">
                <div style="width:10rem">
                    <div class="aui-bar-tab-item textColor"  style="width: 4rem;">
                        <div class="aui-bar-tab-label aui-font-size-16">实付款:</div>
                    </div>
                    <div class="aui-bar-tab-item textColor"  style="width: 4rem;">
                        <div  v-if="couponPrice.is_used != 0 && couponPrice.is_used != 1" class="aui-bar-tab-label aui-font-size-16 aui-text-left textColor">￥{{countPrice}}</div>
                        <div  v-if="couponPrice.is_used==0" class="aui-bar-tab-label aui-font-size-16 aui-text-left textColor">￥{{countPrice-couponPrice.coupon_mustmoney}}</div>
                    </div>
                </div>
                <div class="aui-bar-tab-item aui-bg-info aui-text-white"  style="width: auto;">
                    <div  v-on:click="goShopPay()">立即购买</div>
                </div>
            </footer>
        </div>

        <div  v-if="goodsInfo.goods_image"><!--立即购买-->
            <div  class="aui-flex-row aui-margin-b-5" style="background: #fff">
                <ul  class="aui-flex-item-12 aui-padded-b-10" style="height:5.5rem;background: #fff">
                    <li class="aui-flex-item-4 aui-padded-l-15" >
                        <div class=" aui-margin-r-10" style="height:4.5rem"><img v-bind:src="getImage(goodsInfo.goods_image)"></div>
                    </li>
                    <li class="aui-list-item-inner aui-flex-item-6">
                        <div class="aui-list-item-text" style="margin-top:0.6rem">
                            <div>{{ goodsInfo.goods_name}} </div>
                            <div class="aui-font-size-12  textCol" style="width:7.5rem;overflow: hidden;white-space:nowrap;text-overflow: ellipsis;">{{goodsInfo.goods_desc}}</div>
                            <div class="aui-grid-label aui-font-size-12  aui-margin-0   textCol ">{{getTypeAndColor(goodsInfo.attrText,0)}}</div>
                            <div class="aui-grid-label aui-font-size-12  aui-margin-0  textCol" style="overflow: hidden">{{getTypeAndColor(goodsInfo.attrText,1)}}</div>
                            <!--<div class="aui-grid-label aui-font-size-12  aui-margin-0"><img src="../icon/2-1/fenxiang.png" style="height:0.5rem"></div>-->

                        </div>

                    </li>
                    <li  class="aui-list-item-inner aui-flex-item-2">
                        <div class="aui-font-size-14 aui-text-center" style="margin-top:0.6rem">￥{{goodsInfo.shop_price*goodsInfo.goods_number}}</div>
                        <!--<div class="aui-font-size-14 aui-text-center" style="text-decoration:line-through">￥{{goodsInfo.market_price*goodsInfo.goods_number}}</div>-->
                        <div class="aui-pull-right aui-padded-r-15 textCol " style="margin-top:2.2rem">
                            x <span>{{goodsInfo.goods_number}}</span>
                        </div>
                    </li>
                </ul>
                <div v-if="TJuserINfo.referename&&goodsInfo.is_gift" class=" aui-padded-t-10   aui-padded-b-10 ">
                    <div class="aui-pull-left aui-padded-l-10">推荐人</div>
                    <div class="aui-pull-right aui-padded-r-10 textColor">{{TJuserINfo.referename}}</div>
                </div>
                <div style="clear: both"></div>
                <div style="width:96%;border-bottom: 1px solid #efefef;margin:0 2%"></div>

                <div class="aui-padded-t-10 aui-padded-b-10 ">
                    <div class="aui-pull-left aui-padded-l-10">商品金额</div>
                    <div class="aui-pull-right aui-padded-r-10 textColor">￥{{goodsInfo.shop_price*goodsInfo.goods_number}}</div>
                </div>
                <div style="clear: both"></div>
                <div style="width:96%;border-bottom: 1px solid #efefef;margin:0 2%"></div>
                <div class=" aui-padded-t-10 aui-padded-b-10 ">
                    <div class="aui-pull-left aui-padded-l-10"> 运费</div>
                    <div class="aui-pull-right aui-padded-r-10 textColor">   ￥ <span>0.00</span></div>
                </div>
            </div>

            <div  class="aui-flex-row aui-padded-t-5 aui-margin-b-10">
                <div class=" aui-padded-t-10 aui-padded-b-10  aui-padded-l-10"  @click="goFaPiao()"  style="background: #fff">
                    <div class="aui-pull-left ">  发票</div>
                    <div class="aui-pull-right aui-padded-r-10">
                        <span v-if="faPiaoInfo.isHave == '0'">不开发票</span>
                        <span v-if="faPiaoInfo.type == '0'" class="textColor">{{faPiaoInfo.tel}}</span>
                        <span v-if="faPiaoInfo.type == '1'" class="textColor">{{faPiaoInfo.companyName}}</span>
                        <i class="aui-iconfont aui-icon-right "></i>
                    </div>
                </div>

                <div class="aui-padded-t-10 aui-padded-b-10 aui-padded-l-10 aui-margin-t-10"  @click="goCoupon()" style="background: #fff">
                    <div class="aui-pull-left ">    优惠券</div>
                    <div class="aui-pull-right aui-padded-r-10">
                        <span  v-if="couponPrice.is_used != 0 && couponPrice.is_used != 1">使用优惠券</span>
                        <span class="textColor" v-if="couponPrice.is_used==0">-￥{{couponPrice.coupon_mustmoney}}</span>
                        <span  v-if="couponPrice.is_used==1">无可用</span>
                        <i class="aui-iconfont aui-icon-right "></i>
                    </div>
                </div>
            </div>

            <div class="aui-list-item-title aui-padded-t-5 message" style="height:7.2rem">
                选填:
                <textarea type="text" rows="5" cols="30" placeholder="给商家留言(45字以内)" v-model="submitInfo.massage"></textarea>
            </div>
            <footer class="aui-bar aui-bar-tab " id="footer" style="width:100%;border-top:1px solid #ddd">
                <div style="width:10rem">
                    <div class="aui-bar-tab-item aui-padded-l-10"  style="width: 4rem;">
                        <div class="aui-bar-tab-label aui-font-size-16 textColor">实付款:</div>
                    </div>
                    <div class="aui-bar-tab-item"  style="width: 4rem;">
                        <div  v-if="couponPrice.is_used != 0 && couponPrice.is_used != 1" class="aui-bar-tab-label aui-font-size-16 aui-text-left textColor">￥{{countPrice}}</div>
                        <div  v-if="couponPrice.is_used==0" class="aui-bar-tab-label aui-font-size-16 aui-text-left textColor">￥{{countPrice-couponPrice.coupon_mustmoney}}</div>
                    </div>
                </div>

                <div class="aui-bar-tab-item aui-bg-info aui-text-white"  style="width: auto;">
                    <div  v-on:click="goPay()">立即购买</div>
                </div>
            </footer>
        </div>
    </div>
    <div v-if="navigator && navigator.onLine === false" style="position:relative;" @click="goOnLine()">
        <div style="position:absolute;top:50%;left:50%;margin-top:6rem;margin-left: -3rem">
            <img src="../icon/duanwang.png" alt="" style="width:6rem">
            <div class="aui-text-center">暂无网络</div>
        </div>

        <div  class="aui-text-center textCol" style="position:absolute;top:50%;left:50%;margin-top:13rem;margin-left: -86px">请连接网络后,点击刷新</div>
    </div>
</section>
<script type="text/javascript" src="../js/zepto.min.js"></script>
<script type="text/javascript" src="../js/api.js"></script>
<script type="text/javascript" src="../js/aui-tab.js"></script>
<script type="text/javascript" src="../js/vue.min.js"></script>
<script type="text/javascript" src="../js/aui-toast.js" ></script>
<script type="text/javascript" src="../js/buy.js"></script>

<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript" src="../js/weixin.js" ></script>
</body>
</html>